<template>
  <view style="background-image: url('https://hyxs.ychlkj.cn/uploads/20240112/521d795cb2af754c1e8ed35982812cb9.png');background-size: 100% auto;
    background-repeat: no-repeat;min-height: 100vh;max-height: 100%">

    <view style="width: 100%;padding-top: 32px;padding-left: 20px">
      <view class="top-search" @click="toSearch()">
        <img alt="" style="width: 20px;height: 20px;margin-right: 10px" src="https://hyxs.ychlkj.cn/uploads/20240110/5c6ee4ed371fc70d76f80dd99f50eab7.png">
        <test class="text">搜索短剧</test>
      </view>
    </view>

    <view style="font-size: 24px;color: #202020;margin-top: 32px;margin-left: 20px">
      Hello, 上午好!
    </view>
    <view style="color: #757575;margin-top: 4px;margin-left: 20px">欢迎来到鸿鹄畅听</view>

    <view style="text-align: center;padding-top: 10vh">
      <img style="width: 80%" src="https://hyxs.ychlkj.cn/uploads/20240112/75dd0cb1d87ff6c5e77fb0a1e2813d70.png">
    </view>
    <view style="text-align: center;color: #333;font-size: 20px;margin-top: -75px;margin-bottom: 4px">开发中</view>
    <view style="text-align: center;color: #333;font-size: 20px">敬请期待</view>

  </view>
</template>

<script>
export default {
  name: "index",
  data() {
    return {

    }
  },
  onLoad() {
    console.log("index")
  },
  methods: {
    toSearch() {

    }
  }
}
</script>

<style scoped>
.top-search{
  padding: 8px;
  display: flex;
  justify-content: left;
  align-items: center;
  background: rgba(255,255,255,0.7);
  box-shadow: 0px 4px 12px 4px rgba(32,32,32,0.02);
  border-radius: 4px 4px 4px 4px;
  opacity: 1;
  width: 80%;
  border: 1px solid rgba(0,0,0,0.04);
}
.top-search .text{
  height: 14px;
  font-size: 14px;
  font-weight: 400;
  color: #000000;
  line-height: 14px;
}
</style>
